import { useEffect, useState } from "react";
import { Card, Form, Input, Select, Button, Table } from "antd";
import { Link } from "react-router-dom";
import { SearchOutlined } from "@ant-design/icons";
import "./index.less";

import type { TableColumnsType } from "antd";
import type {
  HospitalList,
  HospitalItem,
  SearchOptions,
} from "@/api/hospital/hospitalList/types";
import { reqGetHospitalList } from "@/api/hospital/hospitalList";
import { reqFindByDictCode, reqFindByParentId } from "@/api/dict";
import type { DictList } from "@/api/dict/types";

export default function HospitalList() {
  const columns: TableColumnsType<HospitalItem> = [
    {
      title: "序号",
      key: "index",
      render(_, _record, index) {
        return <div>{index + 1}</div>;
      },
      align: "center",
      width: 100,
    },
    {
      title: "医院LOGO",
      key: "logoData",
      render(_, record) {
        return (
          <img
            src={"data:image/jpeg;base64," + record.logoData}
            alt={record.hosname}
            className="hospital-logo"
          />
        );
      },
      width: 150,
    },
    {
      title: "医院名称",
      dataIndex: "hosname",
      key: "hosname",
      width: 150,
    },
    {
      title: "等级",
      key: "hostypeString",
      render(_, record) {
        return <div>{record.param.hostypeString}</div>;
      },
      width: 150,
    },
    {
      title: "详细地址",
      key: "fullAddress",
      render(_, record) {
        return <div>{record.param.fullAddress}</div>;
      },
      width: 150,
    },
    {
      title: "状态",
      key: "status",
      render(_, record) {
        // status 1 已上线
        // status 0 未上线
        return <div>{record.status ? "已上线" : "未上线"}</div>;
      },
      width: 150,
    },
    {
      title: "创建时间",
      key: "createTime",
      dataIndex: "createTime",
      width: 150,
    },
    {
      title: "操作",
      key: "operator",
      render(_, record) {
        return (
          <>
            <Link to={`/syt/hospital/hospitallist/show/${record.id}`}>
              <Button type="primary" size="small">
                查看
              </Button>
            </Link>
            <Link to={`/syt/hospital/hospitallist/schedule/${record.hoscode}`}>
              <Button type="primary" size="small">
                排班
              </Button>
            </Link>
            <Button type="primary" size="small">
              下线
            </Button>
          </>
        );
      },
      fixed: "right",
      width: 200,
    },
  ];

  // const hospitalList: HospitalList = [
  //   {
  //     id: "65e01f08b998b10f14b2e329",
  //     createTime: "2024-02-29 14:07:04",
  //     updateTime: "2024-03-22 20:41:20",
  //     param: {
  //       hostypeString: "三级甲等",
  //       fullAddress: "北京市市辖区西城区大望路",
  //     },
  //     hoscode: "1000_0",
  //     hosname: "北京人民医院",
  //     hostype: "1",
  //     provinceCode: "110000",
  //     cityCode: "110100",
  //     districtCode: "110102",
  //     address: "大望路",
  //     logoData:
  //       "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",
  //     intro: null,
  //     route:
  //       "乘车路线：12、14、18、19、28、31、34、38、39、40路到中医院；顺2、11、15、16、17、20、21、22、23、24、25、26、27、29、32、33、36、37、41、43、45路、945到国泰下车，向南行300米即到",
  //     status: 1,
  //     bookingRule: {
  //       cycle: 10,
  //       releaseTime: "08:30",
  //       stopTime: "11:30",
  //       quitDay: -1,
  //       quitTime: "15:30",
  //       rule: [
  //         "西院区预约号取号地点：西院区门诊楼一层大厅挂号窗口取号",
  //         "东院区预约号取号地点：东院区老门诊楼一层大厅挂号窗口或新门诊楼各楼层挂号/收费窗口取号",
  //       ],
  //     },
  //   },
  // ];

  const [hospitalList, setHospitalList] = useState<HospitalList>([]);
  const [total, setTotal] = useState(0);
  const [page, setPage] = useState(1);
  const [limit, setLimit] = useState(5);
  const [loading, setLoading] = useState(false);
  const [searchOptions, setSearchOptions] = useState<SearchOptions>({});

  const handlePaginationChange = (page: number, limit: number) => {
    setPage(page);
    setLimit(limit);
  };

  // 获取医院列表
  const getHospitalList = async () => {
    setLoading(true);
    const res = await reqGetHospitalList({
      page,
      limit,
      ...searchOptions,
    });
    setTotal(res.totalElements);
    setHospitalList(res.content);
    setLoading(false);
  };
  useEffect(() => {
    getHospitalList();
  }, [page, limit, searchOptions]);

  const [provinceList, setProvinceList] = useState<DictList>([]);
  const [cityList, setCityList] = useState<DictList>([]);
  const [districtList, setDistrictList] = useState<DictList>([]);
  const [hostypeList, setHostypeList] = useState<DictList>([]);
  // 获取省份数据
  useEffect(() => {
    const findByDictCode = async () => {
      const res = await reqFindByDictCode("Province");
      setProvinceList(res);
    };
    findByDictCode();
  }, []);
  // 获取医院类型数据
  useEffect(() => {
    const findByDictCode = async () => {
      const res = await reqFindByDictCode("Hostype");
      setHostypeList(res);
    };
    findByDictCode();
  }, []);

  const [form] = Form.useForm();

  // 处理省份数据发生变化触发的函数
  const handleProvinceChange = async (value: string) => {
    // 发送请求，获取城市数据
    const cityList = await reqFindByParentId(+value);
    // 清空列表选项
    setDistrictList([]);
    setCityList(cityList);
    // 清空选中的值
    form.resetFields(["cityCode", "districtCode"]);
  };

  // 处理城市数据发生变化触发的函数
  const handleCityChange = async (value: string) => {
    // 发送请求，获取区县数据
    const districtList = await reqFindByParentId(+value);
    setDistrictList(districtList);
    // 清空选中的值
    form.resetFields(["districtCode"]);
  };

  // 查询
  const onFinish = (values: SearchOptions) => {
    setSearchOptions(values);
    setPage(1);
  };

  // 清空
  const onReset = () => {
    form.resetFields();
    setCityList([]);
    setDistrictList([]);
    setPage(1);
    setSearchOptions({});
  };

  return (
    <Card>
      <Form layout="inline" form={form} onFinish={onFinish}>
        <Form.Item className="mb-20" name="provinceCode">
          {/* 
            默认会找数据中label字段作为显示内容，没有label找value
            通过fieldNames修改显示字段
          */}
          <Select
            placeholder="请选择省"
            style={{ width: 200 }}
            fieldNames={{ label: "name" }}
            onChange={handleProvinceChange}
            options={provinceList}
          />
        </Form.Item>
        <Form.Item className="mb-20" name="cityCode">
          <Select
            placeholder="请选择市"
            style={{ width: 200 }}
            fieldNames={{ label: "name" }}
            onChange={handleCityChange}
            options={cityList}
          />
        </Form.Item>
        <Form.Item className="mb-20" name="districtCode">
          <Select
            placeholder="请选择区"
            style={{ width: 200 }}
            fieldNames={{ label: "name" }}
            // onChange={handleChange}
            options={districtList}
          />
        </Form.Item>
        <Form.Item className="mb-20" name="hosname">
          <Input placeholder="医院名称" />
        </Form.Item>
        <Form.Item className="mb-20" name="hoscode">
          <Input placeholder="医院编号" />
        </Form.Item>
        <Form.Item className="mb-20" name="hostype">
          <Select
            placeholder="医院类型"
            style={{ width: 200 }}
            fieldNames={{ label: "name" }}
            // onChange={handleChange}
            options={hostypeList}
          />
        </Form.Item>
        <Form.Item className="mb-20" name="status">
          <Select
            placeholder="医院状态"
            style={{ width: 200 }}
            fieldNames={{ label: "name" }}
            // onChange={handleChange}
            options={[
              { id: 1, name: "已上线", value: 1 },
              { id: 2, name: "未上线", value: 0 },
            ]}
          />
        </Form.Item>
        <Form.Item className="mb-20">
          <Button type="primary" icon={<SearchOutlined />} htmlType="submit">
            查询
          </Button>
          <Button onClick={onReset}>清空</Button>
        </Form.Item>
      </Form>

      <Table
        columns={columns}
        dataSource={hospitalList}
        bordered
        scroll={{ x: 1200 }}
        pagination={{
          pageSizeOptions: [5, 10, 15, 20],
          showQuickJumper: true,
          showSizeChanger: true,
          total: total,
          pageSize: limit,
          showTotal: (total) => `总共${total}条`,
          onChange: handlePaginationChange,
        }}
        loading={loading}
        rowKey="id"
      />
    </Card>
  );
}
